<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
	</head>
	<body>
		<div>
			<h3>多种方法实现按钮点击事件响应</h3>
			直接为HTML标签添加事件响应:
			<button onclick="alert('你点击了: ' + this.textContent)">按钮1</button><br>
			为元素onclick属性添加事件响应:
			<button id="btn2">按钮2</button><br>
			使用监听器监听元素的click事件:
			<button id="btn3">按钮3</button><br>
			使用jQuery的click()方法实现事件响应:
			<button id="btn4">按钮4</button><br>
			使用jQuery的bind()方法实现事件响应:
			<button id="btn5">按钮5</button>
		</div>
		<script>
			document.getElementById('btn2').onclick = function() {
				alert('你点击了: ' + this.textContent);
			};
			document.getElementById('btn3').addEventListener('click', function() {
				alert('你点击了: ' + this.textContent);
			});
			$('#btn4').click(function() {
				alert('你点击了: ' + $(this).text());
			});
			$('#btn5').bind('click', function() {
				alert('你点击了: ' + $(this).text());
			});
		</script>
	</body>
</html>
